<template>
  <a-comment>
    <span
        slot="actions"
        key="comment-basic-reply-to"
        @click="handlReply(comment.commentId, comment.wuser.userName)"
    >
    <a-anchor>
      <a-anchor-link :href="`#my-textarea` + blogId" title="回复"/>
    </a-anchor>
    </span>
    <a slot="author" v-if="comment.parentCommentUser" style="font-size: 15px">{{ comment.parentCommentUser.userName }}</a>
    <a
        v-if="comment.wuser"
        slot="author"
        class="reply-to"
    >@{{ comment.wuser.userName }}</a>
    <a-avatar slot="avatar"
              :src="comment.wuser.avator" alt/>
    <p slot="content">
      {{ comment.commnetContent }}
    </p>
    <a-tooltip slot="datetime">
      <span>{{ $moment(comment.commentDate).format('yyyy-MM-DD HH:mm:ss') }}</span>
    </a-tooltip>
    <slot name="childComment"></slot>
  </a-comment>
</template>

<script>
export default {
  name: "Comment",
  props: {
    comment: {},
    blogId:0
  },
  methods: {
    handlReply(msgId, msgUsername) {
      this.$emit("handleReply", {msgId, msgUsername});
    }
  }
}
</script>

<style scoped>
.reply-to {
  padding-left: 5px;
  color: #409eff;
  font-weight: 500;
  font-size: 15px;
}
</style>
